<template>
	<view class="tab-bar">
		<view v-for="(item, index) in list1" :key="index" class="tab-bar-item" @click="switchTab(item, index)">
			<image class="tab_img" :class="index == 2 ? 'fb' : ''"
				:src="selected === index ? item.selectedIconPath : item.iconPath" />
			<view :class="index == 2 ? 'fb1' : ''" class="tab_text"
				:style="{ color: selected === index ? selectedColor : color }">{{ item.text }}</view>
		</view>
		<view v-if="messageNum > 0" class="xxi">{{
      messageNum > 99 ? "99+" : messageNum
    }}</view>

		<view class="fabuZbc" v-if="fabuZbc" @touchmove.stop.prevent="">
			<view class="fabuZbc_sj">
				
				<view class="show" :style="'padding-top:' + statusBarHeight1 + 'px'">
					<view @click="fabu_guan" v-if="!storeApprove" style="display: flex;align-items: center;">
						<image style="width: 30rpx; height: 30rpx"
							src="https://pic.bangbangtongcheng.com/index-left-arrow.png">
						</image>
						返回
					</view>
					<view @click="storeApproveBack" v-else style="display: flex;align-items: center;">
						<image style="width: 30rpx; height: 30rpx"
							src="https://pic.bangbangtongcheng.com/index-left-arrow.png">
						</image>
						用户认证
					</view>
				</view>
				
				<template v-if="!storeApprove">
					<template v-if="userInfo.businessType == 1">
						<view class="fzView" v-if="userInfo.shopType != 2">
							<image src="https://pic.bangbangtongcheng.com/static/public-maifang.png"
								@click="fabuClick(1)" />
							<p>卖房</p>
						</view>
						<view class="fzView" v-if="userInfo.shopType != 2">
							<image src="https://pic.bangbangtongcheng.com/static/public-zufang.png"
								@click="fabuClick(2)" />
							<p>租房</p>
						</view>
						<view class="fzView" v-if="userInfo.isShop == '1'">
							<image src="https://pic.bangbangtongcheng.com/static/public-zhaoquanzhi.png"
								@click="fabuClick(11)" />
							<p>招全职</p>
						</view>
						<view class="fzView" v-if="userInfo.isShop == '1'">
							<image src="https://pic.bangbangtongcheng.com/static/public-zhaojianzhi.png"
								@click="fabuClick(12)" />
							<p>招兼职</p>
						</view>
						<!-- <view class="fzView" v-if="userInfo.isShop == '1' && userInfo.shopType == '1'">
					  <image src="/static/2house-info.png" @click="fabuClick(3)" />
					  <p>公司资料</p>
					</view> -->
						<!-- <view class="fzView" v-if="userInfo.isShop == '1' && userInfo.shopType == '1'">
											<image src="/static/2dynamic-mes.png" @click="fabuClick(4)" />
											<p>门店资讯</p>
										</view> -->
						<!-- <view class="fzView" v-if="userInfo.isShop == '1' && userInfo.shopType == '2'">
					  <image src="/static/2house-info.png" @click="fabuClick(5)" />
					  <p>楼盘轮播</p>
					</view> -->
						<!-- <view class="fzView" v-if="userInfo.isShop == '1' && userInfo.shopType == '2'">
											<image src="/static/2dynamic-mes.png" @click="fabuClick(6)" />
											<p>楼盘资讯</p>
										</view> -->
						<view class="fzView">
							<image src="https://pic.bangbangtongcheng.com/static/public-bangyouquan.png"
								@click="fabuClick(7)" />
							<p>帮友圈</p>
						</view>
					</template>
					<template v-else-if="userInfo.businessType == 2">
						<view class="fzView" v-if="userInfo.shopType == 1 || userInfo.shopType == 2">
							<image src="https://pic.bangbangtongcheng.com/static/public-maiche.png"
								@click="fabuClick(9)" />
							<p>卖车</p>
						</view>
						<view class="fzView" v-if="userInfo.shopType == 3 || userInfo.shopType == 4">
							<image src="https://pic.bangbangtongcheng.com/static/public-fuwuxiangmu.png"
								@click="fabuClick(8)" />
							<p>服务项目</p>
						</view>
						<view class="fzView" v-if="
					    userInfo.isShop == 1 && userInfo.shopType != 3 && userInfo.shopType != 4
					  ">
							<image src="https://pic.bangbangtongcheng.com/static/public-zaishouchexi.png"
								@click="fabuClick(10)" />
							<p>在售车系</p>
						</view>
						<view class="fzView">
							<image src="https://pic.bangbangtongcheng.com/static/public-bangyouquan.png"
								@click="fabuClick(7)" />
							<p>帮友圈</p>
						</view>
						<!-- <view class="fzView" v-if="userInfo.isShop == 1">
					  <image src="/static/2house-info.png" @click="fabuClick(3)" />
					  <p>公司资料</p>
					</view> -->
						<view class="fzView" v-if="userInfo.isShop == '1'">
							<image src="https://pic.bangbangtongcheng.com/static/public-zhaoquanzhi.png"
								@click="fabuClick(11)" />
							<p>招全职</p>
						</view>
						<view class="fzView" v-if="userInfo.isShop == '1'">
							<image src="https://pic.bangbangtongcheng.com/static/public-zhaojianzhi.png"
								@click="fabuClick(12)" />
							<p>招兼职</p>
						</view>
					</template>
					<template v-else>
						<view class="fzView" v-if="userInfo.enterpriseRecruitmentStatus != 1">
							<image src="https://pic.bangbangtongcheng.com/static/public-maifang.png"
								@click="fabuClick(1)" />
							<p>卖房</p>
						</view>
						<view class="fzView" v-if="userInfo.enterpriseRecruitmentStatus != 1">
							<image src="https://pic.bangbangtongcheng.com/static/public-zufang.png"
								@click="fabuClick(2)" />
							<p>租房</p>
						</view>
						<view class="fzView" v-if="userInfo.enterpriseRecruitmentStatus != 1">
							<image src="https://pic.bangbangtongcheng.com/static/public-maiche.png"
								@click="fabuClick(9)" />
							<p>卖车</p>
						</view>
						<view class="fzView">
							<image src="https://pic.bangbangtongcheng.com/static/public-zhaoquanzhi.png" @click="fabuClick(11)"/>
							<p>招全职</p>
						</view>
						<view class="fzView" v-if="!(userInfo.isShop == 0 && userInfo.isAgent == 1)">
							<image src="https://pic.bangbangtongcheng.com/static/public-zhaojianzhi.png"
								v-show="!storeApprove" @click="fabuClick(12)" />
							<p>招兼职</p>
						</view>
						<!-- <view class="fzView" v-if="userInfo.enterpriseRecruitmentStatus != 1">
					  <image
					    src="https://pic.bangbangtongcheng.com/static/bbzc/writeResume.png"
					    @click="fabuClick(13)"
					  />
					  <p>写简历</p>
					</view> -->
						<view class="fzView">
							<image src="https://pic.bangbangtongcheng.com/static/public-bangyouquan.png"
								@click="fabuClick(7)" />
							<p>帮友圈</p>
						</view>
						<!-- <view class="fzView" v-if="userInfo.enterpriseRecruitmentStatus == 1">
					  <image src="/static/2house-info.png" @click="fabuClick(3)" />
					  <p>公司资料</p>
					</view> -->
					</template>

					<view class="loupan-tip" v-if="curUserIdentityType === 'HOUSE_BUILDING'">
						<uni-icons type="info" size="20" color='red' />
						楼盘信息请到电脑端发布
					</view>
				</template>

				<template v-else>

					<view class="fzView">
						<image src="https://pic.bangbangtongcheng.com/static/bbzc/fabu-qiche-renzhen.png"
							@click="storeApproveSeek(2)" />
						<p>认证汽车店铺</p>
					</view>
					<view class="fzView">
						<image src="https://pic.bangbangtongcheng.com/static/bbzc/fabu-fangchan-renzhen.png"
							@click="storeApproveSeek(1)" />
						<p>认证房产店铺</p>
					</view>
					<view class="fzView" v-if="userInfo.enterpriseRecruitmentStatus == 0">
						<image src="https://pic.bangbangtongcheng.com/static/bbzc/fabu-qiye-renzhen.png"
							@click="storeApproveSeek(3)" />
						<p>认证招聘企业</p>
					</view>
					<view class="fzView" v-if="fabuClickType == 12">
						<image src="https://pic.bangbangtongcheng.com/static/bbzc/fabu-geren-renzhen.png"
							@click="storeApproveSeek(4)" />
						<p>个人认证</p>
					</view>
					
					<view class="renzheng-tip" v-if="fabuClickType == 12">
						认证后才可以发布哦！
					</view>
					<view class="renzheng-tip" v-else>
						认证企业或店铺后才可以发布哦！
					</view>
				</template>

			</view>
		</view>

		<!-- 		<view class="mapbuZbc" v-if="storeApprove" @touchmove.stop.prevent="">
			<view class="mapView">
				<image src="https://pic.bangbangtongcheng.com/static/bbcz/dtzc01.png" @click="storeApproveSeek(2)" />
				<p>认证汽车店铺</p>
			</view>
			<view class="mapView">
				<image src="https://pic.bangbangtongcheng.com/static/fabu_c.png" @click="storeApproveSeek(1)" />
				<p>认证房产店铺</p>
			</view>
			<view class="mapView" v-if="userInfo.enterpriseRecruitmentStatus == 0">
				<image src="https://pic.bangbangtongcheng.com/static/bbzc/releaseFullTime.png"
					@click="storeApproveSeek(3)" />
				<p>认证招聘企业</p>
			</view>
			<view class="mapView" v-if="fabuClickType == 12">
				<image src="https://pic.bangbangtongcheng.com/static/bbzc/releaseFullTime.png"
					@click="storeApproveSeek(3)" />
				<p>个人认证</p>
			</view>
			
			<view class="show" @click="storeApprove = false">
				<image style="width: 30rpx; height: 30rpx" src="https://pic.bangbangtongcheng.com/index-left-arrow.png">
				</image>
				返回
			</view>
		</view> -->
	</view>
</template>
<script>
	import {
		mapGetters,
		mapActions
	} from "vuex";
	export default {
		props: {
			selected: {
				// 当前选中的tab index
				type: Number,
				default: 0,
			},
			userIdentity: {
				// 当前角色
				type: Number,
				default: 0,
			},
		},
		data() {
			return {
				storeApprove: false,
				inReview: false,
				color: "#333333",
				selectedColor: "#64B6A8",
				fabuZbc: false,
				userInfo: uni.getStorageSync("Pduser"),
				userAuditStatus: uni.getStorageSync("userAuditStatus"),
				userIdentityType: uni.getStorageSync("userIdentityType"),
				list: [{
						pagePath: "/pages/patientHome/patientHome",
						iconPath: "/static/images/home.png",
						selectedIconPath: "/static/images/home_s.png",
						text: "首页",
					},
					{
						pagePath: "/pages/mine/mine",
						iconPath: "/static/images/mine.png",
						selectedIconPath: "/static/images/mine_s.png",
						text: "我的",
					},
				],
				userIdentityType: null,
				countxx: 0,
				fabuClickType: null,
				list1: [{
						text: "首页",
						iconPath: "https://pic.bangbangtongcheng.com/static/tabbar/index.png", //未选中图标
						selectedIconPath: "https://pic.bangbangtongcheng.com/static/tabbar/index_active.png", //选中图片
						pagePath: "/pages/index/index", //页面路径
					},
					{
						text: "帮友圈",
						iconPath: "https://pic.bangbangtongcheng.com/static/bbcz/byq.png",
						selectedIconPath: "https://pic.bangbangtongcheng.com/static/bbcz/byq_active.png",
						pagePath: "/pages/index/friendsCircle",
					},
					{
						text: "发布",
						iconPath: "https://pic.bangbangtongcheng.com/6bb9949ec1154337a488b471dfe54dc2",
						selectedIconPath: "https://pic.bangbangtongcheng.com/6bb9949ec1154337a488b471dfe54dc2",
						pagePath: "/pages/release/index",
					},
					{
						text: "消息",
						iconPath: "https://pic.bangbangtongcheng.com/static/tabbar/news.png",
						selectedIconPath: "https://pic.bangbangtongcheng.com/static/tabbar/news_active.png",
						pagePath: "/pages/news/index",
					},
					{
						text: "我的",
						iconPath: "https://pic.bangbangtongcheng.com/static/tabbar/my.png",
						selectedIconPath: "https://pic.bangbangtongcheng.com/static/tabbar/my_active.png",
						pagePath: "/pages/my/index",
					},
				],
			};
		},
		computed: {
			...mapGetters(["statusBarHeight1", "messageNum", "curUserAuditStatus", "curUserIdentityType"]),
		},
		onShow() {},
		created() {
			this.checkUserStatus();
			// 获取认证信息
			this.getAuthentication();
		},
		watch: {
			selected: {
				handler() {
					console.log("this.userInfo-->watch");
					this.fnc();
				},
				immediate: true,
			},
		},
		methods: {
			getAuthentication() {
				uni.removeStorageSync('userAuditStatus')
				uni.removeStorageSync('userIdentityType')
				// 根据用户ID查询用户是否认证
				this.$myRequest.get(
					"/api/mobile/public/verifyUserWhetherAuthenticationBusinessOrAgentAll", {
						userId: this.userInfo.id
					}).then(result => {
					if (result.code === 200) {
						if (result.userAuthenticationDto) {
							// null：未认证，后端不会返回这个字段
							// PERSONAL：个人认证
							// HOUSE_BUILDING:楼盘认证
							// HOUSE_REAL_ESTATE_SHOP:房产商家认证
							// HOUSE_BROKER:房产经纪人认证
							// CAR_DEALERSHIP_SHOP::4S店认证
							// CAR_AUTO_TRADING_SHOP:汽贸店认证
							// CAR_AUTO_REPAIR_SHOP: 汽车维修商家认证
							// CAR_BEAUTY_DECORATION_SHOP:美容装饰商家认证
							// CAR_BROKER_CAR_SALES_CONSULTANT:汽车销售顾问认证(4s店经纪人或汽贸店经纪人)
							// RECRUITMENT_COMPANY:招聘企业认证
							this.userIdentityType = result.userAuthenticationDto.userIdentityType
							// 审核状态（0：未审核，1：审核通过，2：审核不通过，3：待商家审核，4：待平台审核）
							this.userAuditStatus = result.userAuthenticationDto.auditStatus
							if (this.userAuditStatus === '1') {
								this.auditText = '认证用户'
							} else {
								this.auditText = '未认证用户'
							}
						} else {
							this.auditText = '未认证用户'
							this.userIdentityType = null
						}
						this.$store.commit('user/SET_USERAUDITSTATUS', this.userAuditStatus);
						this.$store.commit('user/SET_USERIDENTITYTYPE', this.userIdentityType);
						uni.setStorageSync('curUserAuditStatus', this.userAuditStatus)
						uni.setStorageSync('curUserIdentityType', this.userIdentityType)
						console.log("this.$store.state.userAuditStatus;", this.curUserAuditStatus)
						console.log("this.$store.state.userAuditStatus;", this.curUserIdentityType)
					}
				})
			},
			storeApproveBack() {
				this.storeApprove = false;
				this.fabuClickType = null;
			},
			storeApproveSeek(index) {
				if (this.inReview) {
					this.storeApprove = false;
					uni.showToast({
						title: "当前已有认证审核中，请耐心等候！",
						icon: "none",
						mask: true,
					});
					return;
				}
				if (index == 1) {
					uni.navigateTo({
						url: "/pages_my/enter_merchant",
					});
				} else if (index == 2) {
					uni.navigateTo({
						url: "/pages_owner/my/shopCertification",
					});
				}else if(index == 4) {
					uni.navigateTo({
						url: "/pages_recruitMoney/my/certificationInformation"
					})
				}else {
					uni.navigateTo({
						url: "/pages_recruitMoney/my/shopCertification",
					});
				}
				this.storeApprove = false;
			},
			//消息条数
			fnc() {
				this.userInfo = uni.getStorageSync("Pduser");
				console.log("this.userInfo", this.userInfo);
				if (this.userInfo.id) {
					this.$myRequest
						.get("/mob/user/getIsReadMsg", {
							isRead: 2,
							examineStatus: 2,
							userId: this.userInfo.id,
						})
						.then((res) => {
							console.log(res.result);
							// if(res.result>0){
							console.log(this.$store);

							this.$store.commit("user/SET_MESSAGENUM", res.result);
							// }
							// this.countxx = res.result;
						});
				}
			},
			switchTab(item, index) {
				this.userInfo = uni.getStorageSync("Pduser");
				let that = this;
				this.countxx = 0;
				this.$nextTick(() => {
					that.checkUserStatus();
				});
				this.fnc();
				if (item.text == "发布") {
					if (!that.showLogin()) {
						return;
					}
					if (this.userInfo.isShop == 1 && this.userInfo.isAgent == 0) {
						uni.showToast({
							title: "商家不可发布房源",
							icon: "none",
							mask: true,
						});
						return false;
					}
					// if (this.userInfo.shopType == 2) {
					//   uni.showToast({
					//     title: "楼盘不可发布房源",
					//     icon: "none",
					//     mask: true,
					//   });
					//   return false;
					// }
					this.fabuZbc = true;
				} else if (item.text == "消息") {
					if (!that.showLogin()) {
						return;
					}
					let url = item.pagePath;
					uni.switchTab({
						url,
					});
				} else {
					let url = item.pagePath;
					uni.switchTab({
						url,
					});
				}
			},
			fabuClick(num) {
				if (!this.userInfo.phone) {
					uni.showToast({
						title: "请登录",
						icon: "none",
						mask: true,
					});
					return;
				}

				if (num == 1) {
					uni.navigateTo({
						url: "/pages_houses/housing/salesType",
					});
					// uni.navigateTo({
					// 	url: "/pages_release/index",
					// });
				} else if (num == 2) {
					// uni.navigateTo({
					// 	url: "/pages_release/tenement",
					// });
					uni.navigateTo({
						url: "/pages_houses/housing/salesType?fromType=" + "tenement",
					});
				} else if (num == 3) {
					uni.navigateTo({
						url: "/pages_release/sellingInfomation?identify=1",
					});
				} else if (num == 4) {
					uni.navigateTo({
						url: "/pages_release/sellingInfomation?identify=2",
					});
				} else if (num == 5) {
					if (!this.userInfo.buildingsId) {
						uni.showToast({
							title: "您还未发布楼盘，请前往PC端发布楼盘！",
							icon: "none",
							mask: true,
						});
						return;
					}
					uni.navigateTo({
						url: "/pages_release/sellingInfomation?identify=3",
					});
				} else if (num == 6) {
					uni.navigateTo({
						url: "/pages_release/sellingInfomation?identify=4",
					});
				} else if (num == 7) {
					uni.navigateTo({
						url: "/pages_owner/release/releaseFriends",
					});
				} else if (num == 8) {
					uni.navigateTo({
						url: "/pages_owner/release/servicesAvailable",
					});
				} else if (num == 9) {
					uni.navigateTo({
						url: "/pages_owner/release/sellCar",
					});
				} else if (num == 10) {
					uni.navigateTo({
						url: "/pages_owner/release/saleCarSeries",
					});
				} else if (num == 11) { // 商家和企业可以发布全职和兼职，普通用户可以发布兼职，经纪人不可发布招聘信息
					// 发布全职 !this.inReview
					console.log("num == 11", this.curUserIdentityType)
					if (!this.curUserIdentityType || this.curUserIdentityType === 'HOUSE_BROKER' || this
						.curUserIdentityType === 'CAR_BROKER_CAR_SALES_CONSULTANT' || this.curUserIdentityType ===
						'PERSONAL') {
						this.storeApprove = true;
						this.fabuClickType = null;
						return;
					}

					uni.navigateTo({
						url: "/pages_recruitMoney/publish/publishFullTime",
					});
				} else if (num == 12) {
					// 发布兼职 !this.inReview
					console.log("num == 12", this.curUserIdentityType)
					if (!this.curUserIdentityType || this.curUserIdentityType === 'HOUSE_BROKER' || this
						.curUserIdentityType === 'CAR_BROKER_CAR_SALES_CONSULTANT') {
						this.storeApprove = true;
						this.fabuClickType = 12;
						return;
					}

					if (
						this.userInfo.businessType == 0 &&
						this.userInfo.enterpriseRecruitmentStatus == 0
					) {
						// businessType = 0&& enterpriseRecruitmentStatus == 0为普通用户，businessType = 0 && enterpriseRecruitmentStatus == 1为企业
						this.$myRequest
							.get("/api/mobile/personnelOwner/getPersonalAuthenticationByUserId", {
								userId: this.userInfo.id,
							})
							.then((res) => {
								if (res.code === 200) {
									if (
										res.personalCertification &&
										(res.personalCertification.auditStatus === "0" ||
											res.personalCertification.auditStatus === "2")
									) {
										uni.navigateTo({
											url: "/pages_recruitMoney/my/certificationInformation",
										});
									} else {
										uni.navigateTo({
											url: "/pages_recruitMoney/publish/publishConcurrently",
										});
									}
								}
							});
					} else {
						uni.navigateTo({
							url: "/pages_recruitMoney/publish/publishConcurrently",
						});
					}
				} else if (num == 13) {
					uni.navigateTo({
						url: "/pages_recruitMoney/publish/writeResume",
					});
				}
				this.fabuZbc = false;
			},
			fabu_guan() {
				this.fabuZbc = false;
			},

			checkUserStatus() {
				// console.log("检查账号状态", this.userInfo);
				//根据账号更新用户最新数据
				// this.userInfo = uni.getStorageSync("Pduser");
				if (!this.userInfo) return;
				this.$myRequest
					.get("/mob/login/getUserInfoByPhone", {
						phone: this.userInfo.phone,
					})
					.then((res) => {
						console.log(res.userInfo);
						if (res.userInfo) {
							if (this.userInfo.isEnables && this.userInfo.isEnables != "1") {
								uni.showModal({
									title: "",
									content: "您的账号已被冻结，不能使用！",
									cancelText: "去申诉",
									cancelColor: "#64b6a8",
									confirmText: "退出登录",
									success: (res) => {
										if (res.confirm) {
											uni.navigateTo({
												url: "/pages/login/login",
											});
											setTimeout(() => {
												uni.removeStorage({
													key: "Pduser",
												});
												const user = uni.getStorageSync("Pduser");
												this.$store.dispatch("user/logout", {});
											}, 1200);
										} else if (res.cancel) {
											uni.navigateTo({
												url: "/pages_my/complaint",
											});
										}
									},
								});
								return;
							}
						}
					});
			},
			getUserPhone(phone) {
				let that = this;
				this.$myRequest
					.get("/mob/login/getUserInfoByPhone", {
						phone: phone,
					})
					.then((res) => {
						this.userInfo = res.userInfo;
						uni.setStorageSync("Pduser", res.userInfo);
						that.$store.dispatch("user/login", res.userInfo);
						this.$myRequest
							.get("/api/mobile/personnelOwner/getAuditingPersonalCertificationByUserId", {
								userId: this.userInfo.id,
							})
							.then((res) => {
								console.log(res);
								this.inReview = res.whetherHave;
								console.log("是否有审核", this.inReview);
							});
					});
			},
		},
	};
</script>

<style lang="scss" scoped>
	.fabuZbc {
		position: fixed;
		width: 100%;
		top: 0;
		bottom: 0;
		//background-color: rgba(0, 0, 0, 0.7);
		background-color: white;
		background-image: url('https://pic.bangbangtongcheng.com/static/fabu-new-bg.png');
		background-size: 100% 100%;
		background-position: center;
		background-repeat: no-repeat;
		//z-index: 99999;

		.fabuZbc_sj {
			width: 100%;
			position: absolute;
			top: 35%;
			left: 0;
			display: flex;
			justify-content: center;
			flex-wrap: wrap;

			.fzView {
				// width: 25%;
				width: 190rpx;
				height: 190rpx;
				//text-align: center;
				//background-color: #3A8388;
				//border-radius: 50%;
				// border: 12rpx solid #E5F4F3;
				margin: 0rpx 30rpx;
				margin-bottom: 80rpx;

				image {
					width: 100%;
					height: 100%;
					// margin-top: 26rpx;
					//       width: 42rpx;
					//       height: 42rpx;
				}

				p {
					display: none;
					width: 100%;
					font-size: 32rpx;
					color: #fff;
					text-align: center;
					//margin-top: 24rpx;
					white-space: nowrap;
					//background: linear-gradient(44.38836405631774deg, #F8EAE2 0%, #FBB386 100%);
				}
			}

			.show {
				position: fixed;
				width: 200rpx;
				left: 20rpx;
				top: 0rpx;
				line-height: 88rpx;
				display: flex;
				align-items: center;
				font-weight: 700;
				font-size: 32rpx;
				color: #000000;
			}

			.loupan-tip {
				position: fixed;
				padding: 20rpx 40rpx;
				height: 32rpx;
				left: 50%;
				transform: translateX(-50%);
				top: 300rpx;
				display: flex;
				width: 440rpx;
				height: 80rpx;
				background: #F9E5E5;
				border-radius: 10rpx;
				font-weight: 400;
				font-size: 28rpx;
				color: #E00201;
				text-align: center;
			}
			
			.renzheng-tip{
				width: 710rpx;
				height: 100rpx;
				background: #F9E5E5;
				border-radius: 10rpx;
				position: fixed;
				left: 20rpx;
				line-height: 100rpx;
				font-weight: 500;
				font-size: 32rpx;
				color: #E00201;
				text-align: center;
				bottom: 50rpx;
			}
		}
	}

	.tab-bar {
		position: fixed;
		z-index: 50;
		bottom: -1px;
		left: 0;
		right: 0;

		// padding-bottom: calc(env(safe-area-inset-bottom) / 2);
		// height: 100rpx;
		height: calc(100rpx + env(safe-area-inset-bottom) / 2);
		background: white;
		display: flex;
		justify-content: center;
		align-items: center;
		padding-bottom: calc(env(safe-area-inset-bottom) / 2); // 适配iphoneX的底部
		box-shadow: 0px -1px 15px rgba(0, 0, 0, 0.16);

		.tab-bar-item {
			flex: 1;
			text-align: center;
			display: flex;
			justify-content: center;
			align-items: center;
			flex-direction: column;

			.tab_img {
				/* #ifdef MP-WEIXIN */
				width: 54rpx;
				height: 54rpx;
				/* #endif */
				width: 54rpx;
				height: 54rpx;
			}

			.fb {
				width: 180rpx;
				height: 126rpx;
				position: absolute;
				top: -52rpx;
				left: 50%;
				transform: translateX(-50%);
				// background: #fff;
				border-radius: 50%;
			}

			.fb1 {
				transform: translateY(26rpx);
			}

			.tab_text {
				font-size: 24rpx;
				margin-top: 9rpx;
			}
		}

		.xxi {
			position: fixed;
			right: 170rpx;
			bottom: calc(env(safe-area-inset-bottom) / 2 + 68rpx);
			// width: 8px;
			min-width: 42rpx;
			height: 38rpx;
			border-radius: 20rpx;
			background-color: red;
			color: #fff;
			padding: 4rpx 12rpx;
			display: flex;
			align-items: center;
			justify-content: center;
			font-size: 24rpx;
		}
	}

	.mapbuZbc {
		position: fixed;
		width: 100%;
		top: 0;
		bottom: 0;
		background-color: rgba(0, 0, 0, 0.7);
		display: flex;
		justify-content: center;

		.mapView {
			padding: 0 28rpx;
		}

		view {
			display: inline-block;
			position: relative;
			margin-top: 75%;
			text-align: center;

			image {
				// width: 130rpx;
				// height: 130rpx;
				width: 120rpx;
				height: 120rpx;
			}

			p {
				width: 100%;
				// font-size: 40rpx;
				font-size: 35rpx;
				color: #fff;
				text-align: center;
				margin-top: 24rpx;
				white-space: nowrap;
			}
		}

		.show {
			position: absolute;
			width: 58rpx;
			height: 58rpx;
			left: 50%;
			transform: translateX(-43%);
			top: 270rpx;
		}
	}
</style>